<!--
 * @Description:基础事件对象
 * @Author: Sun
 * @Date: 2019-07-01 20:05:50
 * @LastEditors: Sun
 * @LastEditTime: 2019-07-07 17:52:23
 -->
<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>基础事件对象</title>
	<style>
		body{height: 4000px;}
		div {
			/* float: left; */
			margin: 10px;
		}

		#div1 {
			width: 50px;
			height: 50px;
			background: red;
		}

		#div2 {
			width: 250px;
			height: 180px;
			background: #CCCCCC;
			display: none;
		}
	</style>

</head>
<script>
	window.onload = function () {
		document.onclick = function (ev) {
			var oEvent=ev||event
			console.log(document.children[0].tagName)
			console.log(oEvent.clientX)
			console.log(oEvent.clientY)
		}
	}
</script>

<body>
	<ul>
		<li>
			body高3000px event.clientX event.clientY<br>
			是相对于屏幕的可视区域点击位置
		</li>
		<li></li>
		<li></li>
	</ul>
	<div id="div1"></div>
	<div id="div2"></div>
</body>

</html>